import { StyleSheet, 
  ImageBackground, 
  Text, 
  FlatList,
  ToastAndroid,
  BackHandler,
  View, 
  Image,
  Button,
  Modal,
  TextInput,
  ScrollView,
  Dimensions,
  TouchableOpacity,
  PixelRatio,
  Platform,
  Share,
  Animated
} from 'react-native';
import React, { useState,useEffect,useRef } from 'react';
import './global';

const Btn = ({style,font,children,...rest})=>{
  return (
    <TouchableOpacity
      {...rest}
      style={
        [style,
          {justifyContent:'center',alignItems:'center'}
        ]
      }
    >
      <Text style={font}>{children}</Text>
    </TouchableOpacity>
  )
}

export default function App() {
  const share = async ()=>{
    const result = await Share.share(
      {message: 'hello'},
      {dialogTitle:'标题'}
    )
    console.log(result);
  }
  const w = useRef(new Animated.Value(10)).current
  const change = ()=>{
    Animated.spring(
      w,
      {
        toValue: 100,
        duration: 500,
        useNativeDriver: false
      }
    ).start();
  }
  return (
    <View style={[styles.container]}>
      <Animated.View style={
        {width: w,height: 100,backgroundColor: '#aaa'}
      }>
      </Animated.View>
      <Btn
        font={{color:'#fff',fontSize: 20}}
        style={{
          width: p2d(150),
          height: 32,
          backgroundColor: 'red',
        }}
        onPress={change}
      >
        变化
      </Btn>
      
      <Btn 
        onPress={share}
        style={{
          width: p2d(150),
          height: 32,
          backgroundColor: 'red',
        }}
        font={{color:'#fff',fontSize: 20}}
      >
        自定
      </Btn>

     
    </View>
  );
}
const styles = StyleSheet.create({
  container:{
    paddingTop: 30,
    flex: 1,
  }
});